<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ page isELIgnored="false"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!doctype html>
<html lang="zh-CN">
<head>
<meta content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" name="viewport" />
<meta charset="utf-8">
<title>皮肤计划</title>
<style type="text/css">
td, th {
	padding: 10px;
}

.version {
	width: 30px;
}
</style>
</head>
<body>
	<input type="hidden" class="cache_skin" env_type="test" app_type="ios" code="${iosTestSkin.code }" begin_date="${iosTestSkin.begin_date }" end_date="${iosTestSkin.end_date }"
		version="${iosTestSkin.version }" />
	<input type="hidden" class="cache_skin" env_type="product" app_type="ios" code="${iosProductSkin.code }" begin_date="${iosProductSkin.begin_date }" end_date="${iosProductSkin.end_date }"
		version="${iosProductSkin.version }" />
	<input type="hidden" class="cache_skin" env_type="test" app_type="android" code="${androidTestSkin.code }" begin_date="${androidTestSkin.begin_date }" end_date="${androidTestSkin.end_date }"
		version="${androidTestSkin.version }" />
	<input type="hidden" class="cache_skin" env_type="product" app_type="android" code="${androidProductSkin.code }" begin_date="${androidProductSkin.begin_date }"
		end_date="${androidProductSkin.end_date }" version="${androidProductSkin.version }" />
	<h4>Android皮肤计划</h4>
	<table border="1">
		<thead>
			<tr>
				<th>编号</th>
				<th>皮肤名称</th>
				<th>状态</th>
				<th>开始时间</th>
				<th>结束时间</th>
				<th>版本</th>
				<th>创建时间</th>
				<th>更新时间</th>
				<th>操作</th>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${androidSkinList }" var="skin">
				<tr skin_id="${skin.id }">
					<td>${skin.id }</td>
					<td>${skin.name }</td>
					<td><span class="test">-</span>,<span class="product">-</span></td>
					<td><input class="begin-date" placeholder="yyyy-MM-dd HH:mm:ss" /></td>
					<td><input class="end-date" placeholder="yyyy-MM-dd HH:mm:ss" /></td>
					<td><input class="version" value="1" type="number" /></td>
					<td><fmt:formatDate value="${skin.gmtCreate }" pattern="yyyy-MM-dd HH:mm:ss" /></td>
					<td><fmt:formatDate value="${skin.gmtWrite }" pattern="yyyy-MM-dd HH:mm:ss" /></td>
					<td><a target="_blank" href="skin_form.htm?id=${skin.id }">修改</a>
						<button class="btnPublish" type="test">内测</button>
						<button class="btnPublish" type="product">发布</button></td>
				</tr>
			</c:forEach>
		</tbody>
	</table>

	<h4>IOS皮肤计划</h4>
	<table border="1">
		<thead>
			<tr>
				<th>编号</th>
				<th>皮肤名称</th>
				<th>状态</th>
				<th>开始时间</th>
				<th>结束时间</th>
				<th>版本</th>
				<th>创建时间</th>
				<th>更新时间</th>
				<th>操作</th>
			</tr>
		</thead>
		<tbody>
			<c:forEach items="${iosSkinList }" var="skin">
				<tr skin_id="${skin.id }">
					<td>${skin.id }</td>
					<td>${skin.name }</td>
					<td><span class="test">-</span>,<span class="product">-</span></td>
					<td><input class="begin-date" placeholder="yyyy-MM-dd HH:mm:ss" /></td>
					<td><input class="end-date" placeholder="yyyy-MM-dd HH:mm:ss" /></td>
					<td><input class="version" value="1" type="number" /></td>
					<td><fmt:formatDate value="${skin.gmtCreate }" pattern="yyyy-MM-dd HH:mm:ss" /></td>
					<td><fmt:formatDate value="${skin.gmtWrite }" pattern="yyyy-MM-dd HH:mm:ss" /></td>
					<td><a target="_blank" href="skin_form.htm?id=${skin.id }">修改</a>
						<button class="btnPublish" type="test">内测</button>
						<button class="btnPublish" type="product">发布</button></td>
				</tr>
			</c:forEach>
		</tbody>
	</table>
	<script type="text/javascript" src="static/jquery-1.11.0.js"></script>
	<script type="text/javascript">
		$(function() {
			$(".btnPublish").click(function() {
				var tr = $(this).parent().parent();
				var p = {
					t : new Date(),
					beginDate : tr.find(".begin-date").val().trim(),
					endDate : tr.find(".end-date").val().trim(),
					type : $(this).attr("type"),
					version : 1,
					id : tr.attr("skin_id")
				};
				$.post("skin_publish.htm", p, function(data) {
					alert(JSON.stringify(data));
				}, "json");

			});
			try {
				$(".cache_skin").each(
						function() {
							var input = $(this);
							var code = input.attr("code");
							var env_type = input.attr("env_type");
							var app_type = input.attr("app_type");
							var begin_date = input.attr("begin_date");
							var end_date = input.attr("end_date");
							var version = input.attr("version");

							var tr = $("tr[skin_id='" + code + "']");
							tr.find("." + env_type).html(
									env_type == "test" ? "测试" : "生产");
							tr.find(".version").html(version);

							var beginDate = new Date(parseFloat(begin_date));
							tr.find(".begin-date").val(beginDate.toCNString());
							tr.find(".end-date").val(new Date(parseFloat(end_date)).toCNString());
						});

			} catch (e) {
				alert(e);
			}

		});
		Date.prototype.toCNString = function() {
			var m = this.getMonth() + 1;
			var d = this.getDate();
			var h = this.getHours();
			var f = this.getMinutes();
			var f = this.getMinutes();
			var s = this.getSeconds();
			
			return this.getFullYear() + "-" + (m > 9 ? m : "0" + m) + "-"
					+ (d > 9 ? d : "0" + d) + " " + (h > 9 ? h : "0" + h) + ":"
					+ (f > 9 ? f : "0" + f) + ":" + (s > 9 ? s : "0" + s);
		}
	</script>
</body>
</html>